<template>
  <div class="tooltip">
    <SvgIcon svg-name="info" className="error-svg" />
    <div class="tooltip-content">
      <span class="tooltip-content_title">{{ sys.error.OFFLINE_TITLE }}</span>
      <span class="tooltip-content_detail">
        {{ sys.error.OFFLINE_DESCRIPTION }}
      </span>
    </div>
    <SvgIcon
      svg-name="arrow"
      :color="sys.color.ARROW_COLOR"
      class-name="arrow-svg"
    />
  </div>
</template>

<script setup>
import { sys } from '../../utils/sys'
</script>

<style lang="less" scoped>
@import url(../../assets/style/tooltip.less);
</style>
